import React, {useEffect, useContext, useState } from 'react';
import {  ScrollView, View,ImageBackground } from 'react-native';
import {  Avatar, Image, ListItem, Text } from 'react-native-elements';

import WalletContext from '../libs/wallet';
import { formartMoney } from '../libs/helpers';
import { getBalances } from '../libs/nodes';
import sat from '../assets/logo.png';

import {constansts} from "./../libs/constansts";
import LocaleContext from '../libs/locale';

const SendSelectAsset = ({ navigation, route }: any) => {
  const locale: any = useContext(LocaleContext);
  const wallet: any = useContext(WalletContext);
  const [amountSAT, setAmountSAT] = useState('');

  useEffect(() => {
    const work = async () => {
      try {
        const balances = await getBalances(wallet.address);
        setAmountSAT(balances.SAT);
      } catch (e) {
        console.log('getBalances:', e);
      }
      console.log(JSON.stringify(constansts.trantokens));

    };

    work();
    const t = setInterval(work, 5000);
    return () => clearInterval(t);
  }, [wallet]);

  const onCoinClick = async (tx:any)=>{
    const coin=(
      tx.name === 'SAT' ?
      tx.name
      :
      (
        (tx as any).address===constansts.contractAddressImage.sUSDT?
        tx.name
        :
        (
          (tx as any).address===constansts.contractAddressImage.sETH?
          tx.name
          :
          tx.desc
        )
     )
    ) ;
    const tokenAddress=tx.address;
    if(route?.params?.receiver=='RedEnvelopeSelect')
    {
        navigation.replace(('RedEnvelope'),{
            coin: coin,
            tokenAddress
        });
    }
    else
    {
        navigation.replace(('Send'),{
            receiver: route?.params?.receiver,
            coin: coin,
            tokenAddress
        });
    }

    // navigation.replace({
    //   index: 1,
    //   routes: [{
    //     name: 'Normal'
    //   }, {
    //     name: 'Send',
    //     params: { receiver: route?.params?.receiver,
    //     coin: (
    //       tx.name === 'SAT' ?
    //       tx.name
    //       :
    //       (
    //         (tx as any).address===constansts.contractAddressImage.sUSDT?
    //         tx.name
    //         :
    //         (
    //           (tx as any).address===constansts.contractAddressImage.sETH?
    //           tx.name
    //           :
    //           tx.desc
    //         )
    //     )
    //         ) }
    //   }]
    // })

  };

  return (
    <ScrollView>
      <View>
          {
          constansts.trantokens.length
          ?
          constansts.trantokens.map((tx:any)=>(
            <ListItem bottomDivider onPress={() => onCoinClick(tx)}>
             {
                tx.name === 'SAT' ?
                <Avatar  source={require('./../assets/logo.png')} activeOpacity={0.7} iconStyle={{}} />
                :
                (
                  (tx as any).address===constansts.contractAddressImage.sUSDT?
                  <Avatar  source={require('./../assets/susdt.png')} activeOpacity={0.7} />
                  :
                  (
                    (tx as any).address===constansts.contractAddressImage.sETH?
                    <Avatar  source={require('./../assets/1.png')} activeOpacity={0.7} />
                    :
                    (
                      (tx as any).url==""?
                      <Avatar  source={require('./../assets/hotTokenLogo.png')} activeOpacity={0.7} />
                      :
                      <Avatar  source={{uri:(tx as any).url}} activeOpacity={0.7} />
                    )
                  )

                )
              }
                <ListItem.Content style={{ flexDirection: 'row', alignItems: 'center' }}>
                {
                tx.name === 'SAT' ?
                <ListItem.Title style={{  fontSize: 17 }}>{(tx as any).name}</ListItem.Title>
                :
                (
                  (tx as any).address===constansts.contractAddressImage.sUSDT?
                  <ListItem.Title style={{  fontSize: 17 }}>{(tx as any).name}</ListItem.Title>
                  :
                  (
                    (tx as any).address===constansts.contractAddressImage.sETH?
                    <ListItem.Title style={{  fontSize: 17 }}>{(tx as any).name}</ListItem.Title>
                    :
                    <ListItem.Title style={{  fontSize: 17 }}>{(tx as any).desc}</ListItem.Title>
                  )

                )
              }
                  <View style={{ flex: 1 }} />
                  <View style={{alignItems:'flex-end'}}>
                    <Text style={{ fontSize: 18, fontWeight: 'bold' }}>{formartMoney(tx.balance, 4)}</Text>
                    <Text style={{ fontSize: 12, color: '#999999FF' }}>≈ ¥0.0</Text>
                  </View>
                </ListItem.Content>
              </ListItem>
          ))
          :
           <View style={{ flex: 1, justifyContent: 'center' }}>
               <Text style={{
                marginTop: '100%',
                fontSize: 20,
                textAlign: 'center',
                color: 'grey'
              }}>{locale._('noContent')}</Text>
            </View>
          }

      </View>
    </ScrollView>
  );
};

export default SendSelectAsset;
